#mobile-nav-menu {

  height: 100%;
  float: left;
  width: 19%;
  background: white;
  font-size: 14px;
  margin-top: 0px;
  padding: 0;
  position: absolute;
  overflow: auto;
  // box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
  // border-right: 1px solid rgba(34, 34, 34, 0.3);
  // border-bottom: 1px solid rgba(34, 34, 34, 0.3);
  // cursor: pointer;


  li {
    margin: 0;
    // padding :4px 0 ;
    white-space:nowrap;
    outline:0;
    list-style: none;
    border-top:  1px solid rgba(65,65,65,0.1);
    text-align: left;
    font-weight: lighter;
  }


  li:last-of-type {
    border-bottom: 1px solid rgba(65,65,65,0.1);
  }

  .fa-chevron-right {
    font-size: 12px;
    margin: 7px;
    &:hover {
      opacity: 0.75;
      background: #87c9df;
    }
  }

  .nav-btn {
      width: 10px;
      margin: 0;
      padding: 0;
      border: none!important;
      border-radius: 0!important;
      .hide-span{
        color:white
      };
      &:hover {
        background-color: black;
      }
  }
  a{
    color:#000;
  }
  .active{
    background: #87c9df;
  };

}

#content {
  background: whitesmoke;
  width: 80%;
  height: 100%;
  left:20%;
  position: absolute;
  top: 60;
  &.active{
    left:0%;
    width: 100%;
  }
}

.select {
  display: inline-block;
  width: 100%;
  position: relative;
  vertical-align: middle;
  padding: 0;
  overflow: hidden;
  background-color: #fff;
  color: #555;
  border: 1px solid #aaa;
  text-shadow: none;
  border-radius: 4px;	
  transition: box-shadow 0.25s ease;
  z-index: 2;
}

.select:hover {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

.select:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-top-color: #ccc;
  top: 14px;
  right: 10px;
  cursor: pointer;
  z-index: -2;
}
.select select {
  cursor: pointer;
  padding: 10px;
  width: 100%;
  border: none;
  background: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.select select:focus {
  outline: none;
}